{extend name="layout" /}
{block name="button"}
<button class="btn btn-default pull-right margin-top" onclick="javascript:history.go(-1)">返回</button>
{/block}
{block name="content"}
<div class="table-margin">
    <h3 class="text-center">为<{$rule['role_name']}>分配权限</h3>
    <div class="warp">
        <form action="{:url('Role/access')}" method="post">
            <input type="hidden" value="{$rule.id}" name="id"/>
            {foreach name="nodes" item="vo"}
                <div class="app b-group">
                    <p>
                        <label>
                            <strong>{$vo.node_name}</strong>
                            <input id="c_{$vo.id}" class="c_{$vo.id}" type="checkbox" name="rule_ids[]" value="{$vo.id}" {$vo.checked?='checked'} onclick="model('c_{$vo.id}',this)">
                        </label>
                    </p>
                    {foreach name="vo.children" item="n"}
                        <dl class="b-group">
                            <dt>
                                <label>
                                    <strong>{$n.node_name}</strong>
                                    <input id="a_{$n.id}" class="c_{$vo.id} a_{$n.id}" type="checkbox" name="rule_ids[]" value="{$n.id}" {$n.checked?='checked'} onclick="thing('a_{$n.id}','c_{$vo.id}',this)">
                                </label>
                            </dt>
                            {foreach name="n.children" item="a"}
                                <dd>
                                    <label>
                                        <span>{$a.node_name}</span>
                                        <input id="o_{$a.id}" class="c_{$vo.id} a_{$n.id}" type="checkbox" name="rule_ids[]" value="{$a.id}" {$a.checked?='checked'} onclick="operate('a_{$n.id}','c_{$vo.id}')">
                                    </label>
                                </dd>
                            {/foreach}
                        </dl>
                    {/foreach}
                </div>
            {/foreach}
            <button class="btn btn-primary" style="margin:20px auto;">提交</button>
        </form>
    </div>
</div>
<script type="text/javascript">
    function model(cid, obj){
        $('.'+cid).prop('checked', $(obj).is(':checked'));
    }
    function thing(aid, cid, obj){
        $('.'+aid).prop('checked', $(obj).is(':checked'));
        var num = $('.'+cid+':checked').length;
        var cc = $('#'+cid);
        cc.prop('checked', num>1 || !cc.is(':checked'));
    }
    function operate(aid, cid){
        var num1 = $('.'+aid+':checked').length;
        var aa = $('#'+aid);
        aa.prop('checked', num1>1 || !aa.is(':checked'));
        var num2 = $('.'+cid+':checked').length;
        var cc = $('#'+cid);
        cc.prop('checked', num2>1 || !cc.is(':checked'));
    }
    $(function () {
        $('form').submit(function(){
            $(this).ajaxSubmit({
                success:function(res) {
                    if(1 == res.code){
                        layer.alert('分配成功！', {icon: 1});
                    }else{
                        layer.alert(res.msg, {icon:2});
                    }
                }
            });
            return false;
        });
    });
</script>
{/block}